<template>
  <view
    class="avatar"
    :style="{
      width: size,
      height: size,
      margin: center ? '0 auto' : false,
      backgroundColor: bgColor
    }"
  >
    <img :src="img"></img>
  </view>
</template>
<script>
export default {
  inheritAttrs: false,
  props: {
    img: String,
    size: {
      type: String,
      default: "80upx"
    },
    bgColor: {
      type: String,
      default: "#f0f0f0"
    },
    center: {
      type: Boolean,
      default: false
    }
  }
};
</script>

<style scoped lang="scss">
.avatar {
  overflow: hidden;
  border-radius: 100%;
  color: #333333;
}
img {
    width: 100%;
    height: 100%;
  }
</style>
